<template>
  <a-card :bordered="false" class="card-area">
    <a-tabs defaultActiveKey="1">
      <a-tab-pane tab="课程基本信息" key="1">
        <course-base :isEdit="isEdit" ref="baseForm"/>
      </a-tab-pane>
      <a-tab-pane tab="课程简介" key="2" forceRender>
        <intro-form ref="introForm"/>
      </a-tab-pane>
      <a-tab-pane tab="教学大纲" key="3" forceRender>
        <outline-form ref="outlineForm"/>
      </a-tab-pane>
    </a-tabs>
    <div class="ant-pro-footer-toolbar">
      <a-button style="float: right;margin-top: 10px;" @click="save" type="primary">保存</a-button>
      <a-button style="float: right;margin-top: 10px;margin-right: 20px" @click="back" type="primary">返回</a-button>
    </div>
  </a-card>
</template>

<script>
import courseBase from './components/courseBase'
import introForm from './components/introForm'
import outlineForm from './components/outlineForm'

export default {
  data () {
    return {
      isEdit: false
    }
  },
  components: {courseBase, introForm, outlineForm},
  beforeCreate () {
    this.form = this.$form.createForm(this)
  },
  created () {
    // console.log(this.$route.query)
    if (this.$route.query.id) {
      this.isEdit = true
      this.$api.cultivate.courseDetail(this.$route.query.id).then(res => {
        let data = res.data
        this.$nextTick(() => {
          this.$refs.baseForm.form.setFieldsValue({
            kch: data.kch,
            kcmc: data.kcmc,
            kcywmc: data.kcywmc,
            kcssyxm: data.kcssyxm,
            kcccm: data.kcccm,
            kclbm: data.kclbm,
            skfsm: data.skfsm,
            ksfsm: data.ksfsm,
            xf: data.xf,
            zxs: data.zxs
          })
          this.$refs.introForm.form.setFieldsValue({kcjj: data.kcjj})
          this.$refs.outlineForm.form.setFieldsValue({jxdg: data.jxdg})
        })
      })
    }
  },
  methods: {
    save () {
      let params = {}
      let isComplete = true
      this.$refs.baseForm.form.validateFields((err, values) => {
        if (err) {
          isComplete = false
          return
        }
        params = Object.assign(params, values)
      })
      this.$refs.introForm.form.validateFields((err, values) => {
        if (err) {
          isComplete = false
          return
        }
        params = Object.assign(params, values)
      })
      this.$refs.outlineForm.form.validateFields((err, values) => {
        if (err) {
          isComplete = false
          return
        }
        params = Object.assign(params, values)
      })
      if (isComplete) {
        // params.kch = `${params.kch}${params.kcccm}${params.kclbm}`
        params.kch = `${params.kch}`
        if (this.isEdit) {
          params.id = this.$route.query.id
        }
        let apiFn = this.isEdit ? 'courseUpdate' : 'courseAdd'
        this.$api.cultivate[apiFn](params).then(res => {
          this.$message.success('操作成功')
          this.$router.back()
        })
      }
    },
    back() {
      this.$router.back()
    }
  }
}
</script>

<style>

</style>
